<html>
    <head>
        <meta charset="UTF-8">
        <title>jq基本选择器</title>
        <script type="text/javascript" src="JQuery-js文件/jquery-3.3.1.js"></script>
        <script type="text/javascript">
            function fun1(){
                var $obj = $("#one");
                $obj.css("background-color","red");
            }
            function fun2(){
                var $obj = $(".two");
                $obj.css("background-color","green");
            }
        
            function fun3(){
                var $obj = $("div");
                $obj.css("background-color","blue")
            }
            function fun4(){
                var $obj = $("*");
                $obj.css("background-color","pink")
            }
            function fun5(){
                var $obj = $("#one,span");
                $obj.css("font-size","80");
                $obj.css("color","red");
            }
        </script>


        <style type="text/css">
        div{
            background: gray;
            width: 200px;
            height: 100px;
        }
            
        
        
        </style>
    </head>

    <body>
        <div id="one" class="two"></div><br>
        <div class="two"></div><br>
        <div></div><br>
        <span>我是span标签</span>
        <br>
        <!--定义按钮-->
        <input type="button" id="btn01" value="选择id为one的元素" onclick="fun1();"/>
        <input type="button" id="btn01" value="选择class为two的元素" onclick="fun2();"/>
        <input type="button" id="btn01" value="选择所有div的元素" onclick="fun3();"/>
        <input type="button" id="btn01" value="选择所有元素" onclick="fun4();"/>
        <input type="button" id="btn01" value="选择id为one的与所有span元素" onclick="fun5();"/>
    </body>

</html>